<template>
  <div class="loyalty">
    <p class="isred">{{$t('report.imReportDelistingNotice')}}</p>
    <el-tabs v-model.trim="reportName" type="card" class="header">
      <el-tab-pane :label="$t('report.imOldNewVisite')" name="OldNew">
      </el-tab-pane>
      <el-tab-pane :label="$t('report.imComeBack')" name="ComeBack">
      </el-tab-pane>
      <!-- <el-tab-pane label="访问页数统计" name="VisitPage">
      </el-tab-pane>
      <el-tab-pane label="访问时长统计" name="visitTime">
      </el-tab-pane> -->
      <el-tab-pane :label="$t('report.imRecentLookTime')" name="RecentLookTime" class="time_look">
      </el-tab-pane>
      <keep-alive>
        <component :is="reportName" class="content"></component>
      </keep-alive>
    </el-tabs>
  </div>
</template>
<script>
  import OldNew from './form/OldNew'
  import ComeBack from './form/ComeBack'
  // import VisitPage from './form/VisitPage'
  // import visitTime from './form/VisitTime'
  import RecentLookTime from './form/RecentLookTime'
  export default {
    name: 'loyalty',
    data () {
      return {
        reportName: 'OldNew'
      }
    },
    computed: {
    },
    components: {
      OldNew,
      ComeBack,
      // visitTime,
      // VisitPage,
      RecentLookTime
    },
    methods: {
    }
  }
</script>
<style lang="stylus" scoped>
  @import "../../../../assets/common.styl"
  .isred
    margin-bottom 10px
    color $c-pink
    padding 20px 30px 0 20px
</style>
